import 'package:flutter/material.dart';

class FourthPage extends StatelessWidget {
  const FourthPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Center(child: Icon(Icons.holiday_village))),
      body: CustomScrollView(
        slivers: [
          SliverToBoxAdapter(
            child: Container(
              margin: EdgeInsets.all(20),
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text('Flutter&Vscode的配合开发快捷键。'),
              ),
            ),
          ),
          SliverToBoxAdapter(
            child: Container(
              margin: EdgeInsets.all(20),
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(
                    'Sliver是一个新一类的组件，在CustomScrollView，内部需要加载sliver数组,组件将会变成SL'
                    'iver组件，如果需要使用普通的组件的话那么也是可以的，使用SliverToBoxAdapter。CustomScro'
                    'llView是进入Sliver 的大门。'),
              ),
            ),
          ),
          SliverToBoxAdapter(
            child: Container(
              margin: EdgeInsets.all(20),
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(
                    '可以看出来，一个页面只可以出现一个CustomScrollView，如果有其他的内容的话，需要写在Sliver里面，使用SliverToBoxAdapter包裹起来'),
              ),
            ),
          ),
          SliverToBoxAdapter(
            child: Container(
              margin: EdgeInsets.all(20),
              decoration: BoxDecoration(
                  border: Border.all(color: Colors.black, width: 2)),
              child: FlutterLogo(
                size: 200,
              ),
            ),
          ),
          SliverToBoxAdapter(
            child: Container(
                margin: EdgeInsets.all(20),
                decoration: BoxDecoration(
                    border: Border.all(color: Colors.black, width: 2)),
                child: Center(child: Text('你好这是个文字'))),
          ),
          SliverToBoxAdapter(
            child: Container(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text('下面是一个可以动态加载的网格视图，可以加载无限个，而且并不会死机'),
              ),
            ),
          ),
          SliverGrid(
              delegate: SliverChildBuilderDelegate((ctx, idx) {
                return Container(
                  height: 200,
                  color: Colors.primaries[idx % 18],
                );
              }, childCount: 244),
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 4,
              )),
          SliverList(
            delegate: SliverChildBuilderDelegate((ctx, idx) {
              print('这是第$idx个色块了');

              return Container(
                color: Colors.primaries[idx % 18],
              );
            }, childCount: 20),
          ),
          SliverToBoxAdapter(
            child: Text('前面几个都是使用builder从新返回一个组件'),
          ),
          SliverList(
              delegate: SliverChildListDelegate([
            FlutterLogo(size: 400),
            FlutterLogo(
              size: 200,
            ),
            FlutterLogo(),
          ])),
          SliverFixedExtentList(
              delegate: SliverChildListDelegate([
                FlutterLogo(),
                FlutterLogo(
                  size: 400,
                ),
                FlutterLogo(),
              ]),
              itemExtent: 200),
          SliverToBoxAdapter(
            child: Container(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text('这里的itemExtent可以用来给内部组件一个紧约束'),
              ),
            ),
          ),
          SliverPrototypeExtentList(
              delegate: SliverChildListDelegate([
                FlutterLogo(),
                FlutterLogo(),
                FlutterLogo(),
              ]),
              prototypeItem: FlutterLogo(
                size: 209,
              )),
          SliverFillViewport(
              delegate: SliverChildListDelegate([
            Text(
              '每一个Text都会填满每个视窗',
              style: TextStyle(fontSize: 60),

            ),
            Text(
              'Text',
              style: TextStyle(fontSize: 200),
            ),
            Text(
              'Text',
              style: TextStyle(fontSize: 200),
            ),
            Text(
              'Text',
              style: TextStyle(fontSize: 200),
            ),
          ]))
        ],
      ),
    );
  }
}
